<!DOCTYPE html>
<html>

<head>
    <title>主页</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" type="text/css" href="../dist/css/reset.css">
    
    <!--图标样式-->
    <link rel="stylesheet" type="text/css" href="../dist/css/bootstrap.min.css" />
    <!--主要样式-->
    <link rel="stylesheet" type="text/css" href="../dist/css/tree.css" />
    <link rel="stylesheet" type="text/css" href="../dist/css/atom.css">
    <link rel="stylesheet" type="text/css" href="../dist/css/common.css">
    <link rel="stylesheet" type="text/css" href="../dist/css/dialog.css">
    <link rel="stylesheet" type="text/css" href="../dist/css/font-awesome.min.css">
    <style type="text/css">
		ul{
			margin:0 0 1rem 2rem;
		}
		em{
			font-style:normal;
		}
    </style>
</head>

<body>
    <!-- header -->
    <header>
        <div class="left">
            <span class="logo-graphic">A</span>
            <em>我的OA,一切从简</em>
        </div>
    </header>
    <!-- header END -->
    <section class="container">
        <div class="search-panel" style="left:0; bottom: inherit;">
	        <div class="search-bar" style="width=100%;">
	            <i class="fa fa-search"></i>
	            <input type="text" name="search" placeholder="请输入姓名" />
	        </div>
        </div>
		
        <div class="tree mgb-4 mgt-4">
            <ul>
                <li class="company">
                    <span class="comp-title"><i class="fa fa-address-card"></i>青鸟科技有限公司</span> <a href=""></a>
                    <ul>
                        <li class="apartment">
                            <span class="apart-title"><i class="fa fa-users"></i> 信息部</span>
                            <ul>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                            </ul>
                        </li>
                        <li class="apartment">
                            <span class="apart-title"><i class="fa fa-users"></i> 信息部</span>
                            <ul>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                                <li>
                                    <span><i class="fa fa-user"></i></span> <a href="contactInfo.html">林芬芬</a>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
        
        <!-- footer -->
        <footer>
        	<ul class="foot-tab-bar" style="margin:0;">
        		<li><a href="#"><i class="fa fa-home"></i><p>主页</p></a></li>
        		<li><a href="applyByMe.html"><i class="fa fa-th-large"></i><p>应用</p></a></li>
        		<li class="active"><a href="structure.html"><i class="fa fa-users"></i><p>联系</p></a></li>
        		<li><a href="personalInfo.html"><i class="fa fa-user"></i><p>我的</p></a></li>
        	</ul>
        </footer>
        <!-- footer START -->
    </section>
    <script type="text/javascript" src="../dist/js/jquery-3.1.1.js"></script>
    <script type="text/javascript" src="../dist/js/jquery.flexslider-min.js"></script>
    <script type="text/javascript" src="../dist/js/equ.js"></script>
   
    <script type="text/javascript">
    $(function() {
        $('.tree li:has(ul)').addClass('parent_li').find(' > span').attr('title', 'Collapse this branch');

        $('.tree li.parent_li > span').on('click', function(e) {
            var children = $(this).parent('li.parent_li').find(' > ul > li');
            if (children.is(":visible")) {
                children.hide('fast');
                $(this).attr('title', 'Expand this branch').find(' > i').addClass('icon-plus-sign').removeClass('icon-minus-sign');
            } else {
                children.show('fast');
                $(this).attr('title', 'Collapse this branch').find(' > i').addClass('icon-minus-sign').removeClass('icon-plus-sign');
            }
            e.stopPropagation();
        });
        $(".btn-success").click(function(){
        	$(this).parent(".search-panel").addClass("fade");
        });
    });
    </script>
    </script>
</body>

</html>
